<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <!-- 异步函数：1定时函数，2AJAX，3事件函数（click等） -->
    <script src="../js/jQuery.min.js"></script>
    <script>
        // 基于JQUERY的AJAX调用接口 
        $.ajax({
                url: 'http://localhost:3000/data',
                success: function(data) {
                    console.log(data)
                }
            })
            // 多次调用
        $.ajax({
            url: 'http://localhost:3000/data1',
            success: function(data1) {
                console.log(data1)
            }
        })
        $.ajax({
            url: 'http://localhost:3000/data2',
            success: function(data2) {
                console.log(data2)
            }
        })
        $.ajax({
                url: 'http://localhost:3000/data3',
                success: function(data3) {
                    console.log(data3)
                }
            })
            // 多次异步顺序不一定是data1\data2\data3
            // 为了保证顺序必须进行嵌套,把异步函数逐层放入回调函数中
            // 嵌套太多,不利于代码的可读性,会构成回调地狱
            // Promise的两大优势:1.解决回调地狱,2.promise中那些API方便异步操作
    </script>

</body>

</html>